import Watcher from "./observe/watcher";
import { patch } from "./vdom/patch";
import { createElementVNode, createTextVNode } from "./vdom/vdom";

export function initLifeCycle(Vue) {
  // 将vnode转换为真实node
  Vue.prototype._update = function (vnode) {
    // console.log(vnode);
    const vm = this;
    const el = vm.$el;
    //既有初始化又有更新的功能
    vm.$el = patch(el, vnode);
  };
  Vue.prototype._c = function () {
    return createElementVNode(this, ...arguments);
  };
  Vue.prototype._v = function () {
    return createTextVNode(this, ...arguments);
  };
  Vue.prototype._s = function (value) {
    if (typeof value !== "object") return value;
    return JSON.stringify(value);
  };
  Vue.prototype._render = function () {
    const vm = this;
    // 当渲染的时候去实例中取值，就可以将属性和视图绑定
    return vm.$options.render.call(vm);
  };
}
export function mountComponent(vm, el) {
  vm.$el = el;
  // 1.调用render方法生成虚拟dom
  const updateComponent = () => {
    vm._update(vm._render()); //vm.$options.render()虚拟节点
  };
  new Watcher(vm, updateComponent, true); //true用来标志是一个渲染的watcher
  // 2.根据虚拟dom产生真实的dom
  // 3.插入到el元素中
}
